<template>
  <div>
    <el-col :span="6">
      <div>
        <el-input placeholder="请输入名称" v-model="searchVal">
          <el-button
            type="primary"
            slot="append"
            icon="el-icon-search"
            @click="handleSearch"
          ></el-button>
        </el-input>
        <el-card class="el-card">
          <div v-for="o in 20" :key="o" class="text item">
            {{ "列表内容 " + o }}
          </div>
          <div class="paginationClass">
            <el-pagination background layout="prev, pager, next" :total="100">
            </el-pagination>
          </div>
        </el-card>
      </div>
    </el-col>
  </div>
</template>

<script>
export default {
  name: "Test",
  data() {
    return {};
  },
  methods: {},
};
</script>

<style lang="scss" scoped>
.text {
  font-size: 14px;
  text-align: left;
  align-content: left;
}

.item {
  padding: 8px 0;
  border-bottom: 1px solid #f5f5f5;
}

.el-card {
  height: 80vh;
  border-bottom: 1px solid #f5f5f5;
  padding: 10px !important;
}

.paginationClass {
  padding: 10px;
}
</style>